<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>微易航短信平台系统--群组管理/增加旅客</title>
	<%@ include file="/page/common/common.jsp" %>
    <script type="text/javascript">
    jQuery(function($){
		$('#gridTable1').datagrid({
			title:'旅客列表', //标题
			method:'post',
			singleSelect:false, //多选
			height:360, //高度
			fitColumns: true, //自动调整各列，用了这个属性，下面各列的宽度值就只是一个比例。
			striped: true, //奇偶行颜色不同
			collapsible:true,//可折叠
			url:"${ctx}/sys/passenger/query.sys", //数据来源
			sortName: 'personName', //排序的列
			sortOrder: 'desc', //倒序
			remoteSort: true, //服务器端排序
			idField:'personId', //主键字段
			queryParams:{}, //查询条件
			pagination:true, //显示分页
			rownumbers:true, //显示行号
			columns:[[
				{field:'ck',checkbox:true,width:2}, //显示复选框
				{field:'personName',title:'旅客姓名',width:25},
				{field:'personSex',title:'性别',width:20,
					formatter:function(value,row){
						switch(row.personSex){
							case ${constant.MALE}:
								return '男';
								break;
							case ${constant.FEMALE}:
								return '女';
								break;
						}
					}	
				},
				{field:'personType',title:'身份',width:25,
					formatter:function(value,row){
						switch(row.personType){
							case ${constant.PASSENGER}:
								return '旅客';
								break;
							case ${constant.WORKMAN}:
								return '工作人员';
								break;
						}
					}
				},
				{field:'personNi',title:'身份证号码',width:25},
				{field:'personPhone',title:'联系电话',width:25},
				{field:'remark',title:'备注',width:35}
			]],
			toolbar:[{
				text:'新增',
				iconCls:'icon-add',
				handler:function(){
					addrow();
				}
			}
			],
			onLoadSuccess:function(){
				$('#gridTable1').datagrid('clearSelections'); //一定要加上这一句，要不然datagrid会记住之前的选择状态，删除时会出问题
			}
		});
		
	});
    /** 新增 */
    function addrow(){
    	
	}
    
    /** 表格查询 */
	function searchInfo(){
		var fields =$('#queryForm1').serializeArray();
		var params={};
		$.each( fields, function(i, field){//设置查询参数
			params[field.name] = field.value; 
		});
		$('#gridTable1').datagrid('reload',params); //设置好查询参数 reload 一下就可以了
	}
	/** 清空查询条件 */
	function clearForm(){
		$('#queryForm1').form('clear');
	}
	</script>	
  </head>
  
  <body>
    <form id="queryForm1" class="qform">
		<table class="qtable" width="100%">
			<tr>
				<td class="qtd">旅客姓名：<input class="txt" name="personName" style="width: 80px;" /></td>
				<td class="qtd">身份证号：<input class="txt" name="personNi" style="width: 120px;"/></td>
				<td class="qtd">联系电话：<input class="txt" name="personPhone" style="width: 80px;"/></td>
				<td class="qtd" align="center">
					<a href="#" onclick="clearForm();" class="easyui-linkbutton">清空</a>
					<a href="#" onclick="searchInfo();" class="easyui-linkbutton" iconCls="icon-search">查询</a>
				</td>
			</tr>
		</table>
	</form>
	<div class="griddiv">
		<table id="gridTable1"></table>
	</div>
	</body>
</html>
